<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="/commons/taglibs.jsp"%>
<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <%@ include file="/commons/meta.jsp"%>
<title>博文管理,初学者论坛,BeginCode,beginCode</title>
<!-- Bootstrap -->
<link href="${ctx}/css/bootstrap.css" rel="stylesheet">
	<script type="text/javascript" src="${ctx}/js/shCore.js"></script>
	<script type="text/javascript" src="${ctx}/js/shBrushJava.js"></script>
	<link type="text/css" rel="stylesheet" href="${ctx}/css/shCoreDefault.css"/>
	<script type="text/javascript">SyntaxHighlighter.all();</script>
 <script src="${ctx}/js/jquery.min.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
      <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
<style type="text/css">

.bs-callout {
	padding: 20px;
	margin: 20px 0;
	border: 1px solid #eee;
	border-left-width: 5px;
	background-color: #fff;
}

.bs-callout h4 {
	margin-top: 0;
	margin-bottom: 5px
}

.bs-callout p:last-child {
	margin-bottom: 0
}

.bs-callout code {
}

.bs-callout+.bs-callout {
	margin-top: -5px
}

.bs-callout-danger {
	border-left-color: #d9534f
}

.bs-callout-danger h4 {
	color: #d9534f
}

.bs-callout-warning {
	border-left-color: #f0ad4e
}

.bs-callout-warning h4 {
	color: #f0ad4e
}

.bs-callout-info {
	border-left-color: #5bc0de
}

.bs-callout-info h4 {
	color: #5bc0de
}
.bs-docs-header {
	position: relative;
	padding: 30px 15px;
	color: #fff;
	text-align: center;
	text-shadow: 0 1px 0 rgba(0,0,0,.1);
	background-color: #3071a9;
	background-repeat: repeat-x;
}

.bs-docs-header {
	margin-bottom: 40px;
	font-size: 20px
}

.bs-docs-header h1 {
	margin-top: 0;
	color: #fff;
}

.bs-docs-header p {
	margin-bottom: 0;
	font-weight: 300;
	line-height: 1.4;
}

.bs-docs-header .container {
	position: relative;
}
.container h1 {
	margin-top: 0;
	color: #fff;
	text-align: left;
	font-weight:bold;
}
.container p {
	text-align: left;
}
.bs-docs-footer {
	margin-top: 0;
	border-top: 0
}

.bs-docs-footer {
	padding-top: 40px;
	padding-bottom: 20px;
	color: #777;
	text-align: center;
	border-top: 1px solid #e5e5e5
}

.bs-docs-footer-links {
	padding-left: 0;
	margin-top: 20px;
	color: #999
}

.bs-docs-footer-links li {
	display: inline;
	padding: 0 2px
}

.bs-docs-footer-links li:first-child {
	padding-left: 0
}

@media (min-width:768px) {
	.bs-docs-footer p {
		margin-bottom: 0;
		text-align: center;
	}
}


</style>
</head>
<body style="background-color: #f8f8f8;">
<jsp:include  page="top.jsp"/>
 <ol class="breadcrumb">
  <li><a href="#">首页</a></li>
  <li class="active">空间管理</li>
</ol>
     
	
	<div class="container .col-xs-" style="margin-top:10px; border-radius: 0px;">
		<div class="row" >
		<div class="col-md-3">
		<div class="panel panel-primary" style="margin-bottom:10px">
			<div class="panel-body" >
						<div class="media" style="margin-bottom:5px">
						   <a class="media-left" href="">
						    <img src="" id="pic" style="width:80px;height:80px;" alt="">
						  </a>
						  <div class="media-body"  >
						    <h2 class="media-heading " id="nickName" style="color:#EA0000"></h2>
						    	
						  </div>
						</div>
						  <!--
					    <ul class="nav nav-pills" role="tablist">&nbsp;&nbsp;&nbsp;&nbsp;
						  	<li role="presentation" class="active"><a href="#">积分 <span class="badge">42</span></a></li>&nbsp;&nbsp;
						    <li role="presentation" class="active"><a href="#">课程 <span class="badge">2</span></a></li>
						</ul>
						-->
			</div>
		</div>
		 <div class="row">
		 	<div class="col-md-12">
			
		 		<button type="button" class="btn btn-primary" id="addBlog" data-toggle="button" aria-pressed="false" autocomplete="off" style="border-radius: 0px;width:100%;height:60px;margin-bottom:10px;font-weight:bold;font-size:35px">
			  发布博文
			</button>		
		 	</div>
		 	<!--  
		 	<div class="col-md-6">
			<button type="button" class="btn btn-primary" data-toggle="button" aria-pressed="false" autocomplete="off" style="border-radius: 0px;width:100%;height:40px;margin-bottom:10px;margin-left:0px;margin-right:0px;font-weight:bold;font-size:20px">
			  空间管理
			</button>
		 	
		 	</div>
		 	-->
		 </div>
		 <!-- 
			<button type="button" class="btn btn-primary" data-toggle="button" aria-pressed="false" autocomplete="off" style="border-radius: 0px;width:100%;height:60px;margin-bottom:10px;margin-left:0px;margin-right:0px;font-weight:bold;font-size:35px">
			  发布博文
			</button>
			  -->

						 <div class="list-group" id="classList">
							<a href="#" class="list-group-item active"> 博客分类 </a> 
						</div>
						 <div class="list-group" id="readList">
							<a href="#" class="list-group-item active"> 阅读排行</a> 
							 
						</div>
					</div>
					
					<div class="col-md-9" >
					<div class="panel panel-primary" style="margin-top:0;" >
						 <div class="panel-body" >
						<ol class="breadcrumb" style="background-color:#5bc0de;">
						  <li><a href="#">空间</a></li>
						  <li><a href="#">博客</a></li>
						  <li class="active">分类</li>
						</ol >
						<ul class="list-group" style="margin-bottom:10px;">
							<c:forEach items="${blogs}" var="blog">
							  <li class="list-group-item">
									<h3 style="color:#5bc0de"><a href="${ctx}/blog/selBlogView/${blog.bc_blog_id}.html">${blog.blog_title }</a></h3>
									<p>&nbsp;&nbsp;&nbsp;&nbsp;${blog.blog_abstract }</p>
									<div class="row">
										<div  class="col-md-6">
										 <p style="text-align: left;">分类：${blog.classify_note } | ${blog.bc_user_name }</p>
									
									</div>
										<div  class="col-md-6">
										 <p style="text-align: right;"><a href="${ctx}/blog/updBlogInit?blogId=${blog.bc_blog_id }"><b>编辑</b></a>&nbsp; | &nbsp;<b>阅读</b>(${blog.view_count})&nbsp;  </p>
									
									</div>
									</div>
									
							  </li>
							</c:forEach>
						</ul>
						
	<!--  					 <div style="text-align:right;margin-right:20px;">
							<nav >
  <ul class="pagination">
    <li><a href="#">&laquo;</a></li>
    <li  class="active"><a href="#" >1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
    <li><a href="#">6</a></li>
    <li><a href="#">7</a></li>
    <li><a href="#">8</a></li>
    <li><a href="#">9</a></li>
    <li><a href="#">10</a></li>
    <li><a href="#">&raquo;</a></li>
  </ul>
</nav></div>-->	
					</div></div>
					
				
							  
 
						    
 
					</div>
					
			 </div>
			

	</div>
 <jsp:include page="foot.jsp"></jsp:include>



	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script src="${ctx}/js/bootstrap.min.js"></script>
 	<script type="text/javascript">
 	$(function(){
 		 //提交，最终验证。
        $('#addBlog').click(function(){
               window.location.href="${ctx}/blog/addBlogInit";
        });
 		 //加载登录人
        jQuery.ajax({
    		type:"POST",
    	 	url:"${ctx}/user/getUser", 
    	 	data:"",
    		dataType:"json",
    		success:function(data){
    			 var nickName = data.nickName;
    				if( typeof(nickName) != "undefined" &&  nickName != ""){
    					$("#nickName").append(nickName);
    				} 
    			}
    	 	});
		 //加载头像
        jQuery.ajax({
    		type:"POST",
    	 	url:"${ctx}/user/selUserIcon", 
    	 	data:"userId=",
    		dataType:"json",
    		success:function(data){
    			 var pic = data.pic;
    				if( typeof(pic) != "undefined" &&  pic != ""){
    					$("#pic").attr("src","http://123.57.17.244:81/image/iconsavepath/"+pic);
    				} 
    			}
    	 	});
        
 		 //异步加载博客分类和博客
     	 jQuery.ajax({
 			type:"POST",
 		 	url:"${ctx}/classify/selClassifyAjax", 
 		 	data:'',
 			dataType:"json",
 			success:function(data){
 				 if(typeof(data) != undefined){
 					 	$.each(data,function(i){
					 		var liststr= "<a href='#'	class='list-group-item'>"+data[i].classify_note+"</a>";
					 		$("#classList").append(liststr);
						 });
					 }
 				}
 		 	});
     	 jQuery.ajax({
  			type:"POST",
  		 	url:"${ctx}/blog/selBlogAjaxLimitN", 
  		 	data:'',
  			dataType:"json",
  			success:function(data){
  				 if(typeof(data) != undefined){
  					 	$.each(data,function(i){
 					 		var liststr= "<a href='${ctx}/blog/selBlogView/"+data[i].bc_blog_id+".html'	class='list-group-item'>"+data[i].blog_title+" <span class='badge'>"+data[i].view_count+"</span></a>";
 					 		$("#readList").append(liststr);
 						 });
 					 }
  				}
  		 	});
 	});

 	</script>
</body>
</html>
